<!--
  Copyright 2013 IBM Corp.

  Licensed under the Apache License, Version 2.0 (the "License");
  you may not use this file except in compliance with the License.
  You may obtain a copy of the License at

  http://www.apache.org/licenses/LICENSE-2.0

  Unless required by applicable law or agreed to in writing, software
  distributed under the License is distributed on an "AS IS" BASIS,
  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  See the License for the specific language governing permissions and
  limitations under the License.
-->

<script type="text/x-red" data-template-name="delay">

    <div class="form-row">
        <label for="node-input-pauseType"><i class="fa fa-tasks"></i> <span data-i18n="delay.action"></span></label>
        <select id="node-input-pauseType" style="width:270px !important">
            <option value="delay" data-i18n="delay.delaymsg"></option>
            <option value="random" data-i18n="delay.randomdelay"></option>
            <option value="rate" data-i18n="delay.limitrate"></option>
            <option value="queue" data-i18n="delay.fairqueue"></option>
            <option value="timed" data-i18n="delay.timedqueue"></option>
        </select>
    </div>
    <div id="delay-details" class="form-row">
        <label for="node-input-timeout"><i class="fa fa-clock-o"></i> <span data-i18n="delay.for"></span></label>
        <input type="text" id="node-input-timeout" placeholder="Time" style="text-align:end; width:50px !important">
        <select id="node-input-timeoutUnits" style="width:200px !important">
          <option value="milliseconds" data-i18n="delay.milisecs"></option>
          <option value="seconds" data-i18n="delay.secs"></option>
          <option value="minutes" data-i18n="delay.mins"></option>
          <option value="hours" data-i18n="delay.hours"></option>
          <option value="days" data-i18n="delay.days"></option>
        </select>
    </div>

    <div id="rate-details" class="form-row">
        <label for="node-input-rate"><i class="fa fa-clock-o"></i> <span data-i18n="delay.rate"></span></label>
        <input type="text" id="node-input-rate" placeholder="1" style="text-align:end; width:30px !important">
        <label for="node-input-rateUnits"><span data-i18n="delay.msgper"></span></label>
        <input type="text" id="node-input-nbRateUnits" placeholder="1" style="text-align:end; width:30px !important">
        <select id="node-input-rateUnits" style="width:110px !important">
          <option value="second" data-i18n="delay.label.units.second.singular"></option>
          <option value="minute" data-i18n="delay.label.units.minute.singular"></option>
          <option value="hour" data-i18n="delay.label.units.hour.singular"></option>
          <option value="day" data-i18n="delay.label.units.day.singular"></option>
        </select>
        <br/>
        <div id="node-input-dr"><input style="margin: 20px 0 20px 100px; width: 30px;" type="checkbox" id="node-input-drop"><label style="width: 250px;" for="node-input-drop"><span data-i18n="delay.dropmsg"></span></label></div>
    </div>


    <div id="random-details" class="form-row">
        <label for="node-input-randomFirst"><i class="fa fa-clock-o"></i> <span data-i18n="delay.between"></span></label>
        <input type="text" id="node-input-randomFirst" placeholder="" style="text-align:end; width:30px !important">
        &nbsp;&nbsp;&amp;&nbsp;&nbsp;
        <input type="text" id="node-input-randomLast" placeholder="" style="text-align:end; width:30px !important">
        <select id="node-input-randomUnits" style="width:140px !important">
          <option value="milliseconds" data-i18n="delay.milisecs"></option>
          <option value="seconds" data-i18n="delay.secs"></option>
          <option value="minutes" data-i18n="delay.mins"></option>
          <option value="hours" data-i18n="delay.hours"></option>
          <option value="days" data-i18n="delay.days"></option>
        </select>
    </div>

    <div class="form-row">
        <label for="node-input-name"><i class="fa fa-tag"></i> <span data-i18n="common.label.name"></span></label>
        <input type="text" id="node-input-name" data-i18n="[placeholder]common.label.name">
    </div>

</script>

<script type="text/x-red" data-help-name="delay">
    <p>Introduces a delay into a flow or rate limits messages.</p>
    <p>The default delay is 5 seconds and rate limit of 1 msg/second, but both can be configured.</p>
    <p>When set to rate limit messages, they are spread across the configured time period. It can
    also be set to discard any intermediate messages that arrive.</p>
    <p>The "topic based fair queue" adds messages to a release queue tagged by their <code>msg.topic</code> property.
    At each "tick", derived from the rate, the next "topic" is released.
    Any messages arriving on the same topic before release replace those in that position in the queue.
    So each "topic" gets a turn - but the most recent value is always the one sent.</p>
    <p>The "timed release queue" adds messages to an array based on their <code>msg.topic</code> property.
    At each "tick", all the latest messages are released. Any new messages arriving before release will
    replace those of the same topic.</p>
</script>

<script type="text/javascript">
    RED.nodes.registerType('delay',{
        category: 'function',
        color:"#E6E0F8",
        defaults: {
            name: {value:""},
            pauseType: {value:"delay", required:true},
            timeout: {value:"5", required:true, validate:RED.validators.number()},
            timeoutUnits: {value:"seconds"},
            rate: {value:"1", required:true, validate:RED.validators.number()},
            nbRateUnits: {value:"1", required:false, validate:RED.validators.regex(/\d+|/)},
            rateUnits: {value: "second"},
            randomFirst: {value:"1", required:true, validate:RED.validators.number()},
            randomLast: {value:"5", required:true, validate:RED.validators.number()},
            randomUnits: {value: "seconds"},
            drop: {value:false}
        },
        inputs:1,
        outputs:1,
        icon: "timer.png",
        label: function() {
            if (this.pauseType == "delay") {
              var units = this.timeoutUnits ? this.timeoutUnits.charAt(0) : "s";
              if (this.timeoutUnits == "milliseconds") { units = "ms"; }
              return this.name||this._("delay.label.delay")+" "+this.timeout+" "+units;
            } else if (this.pauseType == "rate") {
              var units = this.rateUnits ? (this.nbRateUnits > 1 ? this.nbRateUnits : '') + this.rateUnits.charAt(0) : "s";
              return this.name||this._("delay.label.limit")+" "+this.rate+" msg/"+units;
            } else if (this.pauseType == "random") {
              return this.name || this._("delay.label.random");
            }
            else if (this.pauseType == "timed") {
                var units = '';
                if (this.nbRateUnits > 1) {
                    units = this.nbRateUnits + ' ' + this._("delay.label.units." + this.rateUnits + ".plural");
                } else {
                    units = this._("delay.label.units." + this.rateUnits + ".singular");
                }
                return this.name || this.rate + " " + this._("delay.label.timed") + ' ' + units;
            }
            else {
                var units = this.rateUnits ? (this.nbRateUnits > 1 ? this.nbRateUnits : '') + this.rateUnits.charAt(0) : "s";
                return this.name || this._("delay.label.queue")+" "+this.rate+" msg/"+units;
            }
        },
        labelStyle: function() {
            return this.name?"node_label_italic":"";
        },
        oneditprepare: function() {
          var node = this;
          $( "#node-input-timeout" ).spinner({min:1});
          $( "#node-input-rate" ).spinner({min:1});
          $( "#node-input-nbRateUnits" ).spinner({min:1});

          $( "#node-input-randomFirst" ).spinner({min:0});
          $( "#node-input-randomLast" ).spinner({min:1});

          $('.ui-spinner-button').click(function() {
              $(this).siblings('input').change();
          });

          $( "#node-input-nbRateUnits" ).on('change keyup', function() {
            var $this = $(this);
            var val = parseInt($this.val());
            var type = "singular";
            if(val > 1) {
                type = "plural";
            }
            if($this.attr("data-type") == type) {
                return;
            }
            $this.attr("data-type", type);
            $("#node-input-rateUnits option").each(function () {
                var $option = $(this);
                var key = "delay.label.units." + $option.val() + "." + type;
                $option.attr('data-i18n', 'node-red:' + key);
                $option.html(node._(key));
            })
          });



          if (this.pauseType == "delay") {
            $("#delay-details").show();
            $("#rate-details").hide();
            $("#random-details").hide();
            $("#node-input-dr").hide();
          } else if (this.pauseType == "rate") {
            $("#delay-details").hide();
            $("#rate-details").show();
            $("#random-details").hide();
            $("#node-input-dr").show();
          } else if (this.pauseType == "random") {
            $("#delay-details").hide();
            $("#rate-details").hide();
            $("#random-details").show();
            $("#node-input-dr").hide();
          } else if (this.pauseType == "queue") {
            $("#delay-details").hide();
            $("#rate-details").show();
            $("#random-details").hide();
            $("#node-input-dr").hide();
          } else if (this.pauseType == "timed") {
            $("#delay-details").hide();
            $("#rate-details").show();
            $("#random-details").hide();
            $("#node-input-dr").hide();
          }

          if (!this.timeoutUnits) {
            $("#node-input-timeoutUnits option").filter(function() {
              return $(this).val() == 'seconds';
            }).attr('selected', true);
          }

          if (!this.randomUnits) {
            $("#node-input-randomUnits option").filter(function() {
               return $(this).val() == 'seconds';
            }).attr('selected', true);
          }

          $("#node-input-pauseType").on("change",function() {
            if (this.value == "delay") {
              $("#delay-details").show();
              $("#rate-details").hide();
              $("#random-details").hide();
              $("#node-input-dr").hide();
            } else if (this.value == "rate") {
              $("#delay-details").hide();
              $("#rate-details").show();
              $("#random-details").hide();
              $("#node-input-dr").show();
              } else if (this.value == "random") {
              $("#delay-details").hide();
              $("#rate-details").hide();
              $("#random-details").show();
              $("#node-input-dr").hide();
            } else if (this.value == "queue") {
              $("#delay-details").hide();
              $("#rate-details").show();
              $("#random-details").hide();
              $("#node-input-dr").hide();
            } else if (this.value == "timed") {
              $("#delay-details").hide();
              $("#rate-details").show();
              $("#random-details").hide();
              $("#node-input-dr").hide();
            }
          });
        }
    });
</script>
